<template>
  <div>

    <span> hello world : Example for getUserInfo and getUserPhoneNumber</span>

    <div>
      {{userInfo.nickName}}
    </div>

    <div>
      {{openId}}
    </div>

    <div>
      用户电话号码：{{phoneNumber}}
    </div>

    <div class="section">
      <get-user-info :authShow="authShow"></get-user-info>
    </div>

    <div class="section">
      <get-user-phone-number></get-user-phone-number>
    </div>

  </div>
</template>

<script>
/**
 * 系统首页，获取用户信息，可以使用userinfo页面，通过组件授权
 */
import getUserPhoneNumber from '@/components/getUserPhoneNumber'
import getUserInfo from '@/components/getUserInfo'
export default {
  components: {
    getUserPhoneNumber,
    getUserInfo
  },
  data () {
    return {
      authShow: false
    }
  },
  computed: {
    // 首页获取vuex的数据，必须使用计算属性，其余后期打开的页面则不需要
    userInfo () {
      return this.$store.state.userInfo
    },
    openId () {
      return this.$store.state.openId
    },
    phoneNumber () {
      return this.$store.state.phoneNumber
    }
  },
  methods: {
  },

  mounted () {
  }
}
</script>

<style scoped>
</style>
